<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
<<<<<<< HEAD
   
    .father{
        position: relative;
        width: 500px;
        height: 500px;
        display: flex;
        justify-content: space-between;
    }
    .father div{
        width: 40%;
        height: 200px;
    }
    .son1{
        background-color: red;
    }
    .son2{
        background-color: blue;
=======
    .father {
        width: 80%;
        height: 300px;
        background-color: pink;
        display: flex;
        box-sizing: border-box;
    }
    .father div {
        background-color: orange;
        flex: 1;
        margin: 10px;
>>>>>>> d838155e892df1d55c15c56e08cf71872de0afa6
    }
    </style>
</head>
<body>
<<<<<<< HEAD
    <div><a href="#"></a></div>
    <a href="#">123</a>
    <div class="hnk"></div>
    <div class="father">
        <div class="son1"></div>
        <div class="son2"></div>
    </div>
=======
    <!-- 伸缩布局模式 -->
    <div class="father">
        <div></div>
        <div></div>
        <div></div>
    </div>

>>>>>>> d838155e892df1d55c15c56e08cf71872de0afa6
</body>
</html>